// 我们创建common.less需要对不同大小的屏幕的进行页面适配
//首先我们确定所有的不同大小的页面宽度与font-size的比例都为15(只有当比例相同时每个页面计算出比例相同的font-size值，
//最后页面中的元素根据font-size值进行等比例变化)，通过页面宽度/15计算出不同大小页面的html的font-size的值

//确定好划分比例
@no:15;

//当屏幕大小为320px时，font-size为320px/15
@media screen and (min-width:320px){
    html{
        font-size:320px/@no
    }
}

//当屏幕大小为360px时，font-size为360px/15
@media screen and (min-width:360px){
    html{
        font-size:360px/@no
    }
}

//当屏幕大小为375px时，font-size为375px/15
@media screen and (min-width:375px){
        html{
            font-size: 375px/@no;
        }

}

//当屏幕大小为384px时，font-size为384px/15
@media screen and (min-width:384px){
    html{
        font-size: 384px/@no;
    }

}

//当屏幕大小为400px时，font-size为400px/15
@media screen and (min-width:400px){
    html{
        font-size: 400px/@no;
    }

}

//当屏幕大小为414px时，font-size为414px/15
@media screen and(min-width:414px){
    html{
        font-size: 414px/@no;
    }

}

//当屏幕大小为424px时，font-size为424px/15
@media screen and(min-width:424px){
    html{
        font-size: 424px/@no;
    }

}

//当屏幕大小为480px时，font-size为480px/15
@media screen and(min-width:480px){
    html{
        font-size: 480px/@no;
    }

}

//当屏幕大小为540px时，font-size为540px/15
@media screen and(min-width:540px){
    html{
        font-size: 540px/@no;
    }

}




//当屏幕大小为720px时，font-size为720px/15
@media screen and(min-width:720px){
    html{
        font-size: 720px/@no;
    }

}

//当屏幕大小为750px时，font-size为750px/15
@media screen and(min-width:750px){
    html{
        font-size: 750px/@no;
    }

}